import React from 'react'
// ===================================================================== antd
import { Popconfirm } from 'antd'
// ===================================================================== declare
const { $fn, $Lazy, $http } = window
// ===================================================================== Lazy
const Button = $Lazy.load(()=>import('@antd/button'))
const message = $Lazy.file(()=>import('@antd/message'))
// ===================================================================== 气泡确认
const Index = function({ title, onOk, api, param, label='删除', size='small', refresh=true }){
	const [ visible, setVisible ] = React.useState()
	const close = React.useCallback(()=>{
		setVisible(false)
	}, [])
	return (
		<Popconfirm
			title 		= { `是否确认${label}此条数据?` }
			visible		= { visible }
			placement	= 'topRight'
			onConfirm  	= { ()=>{
				if(api){
					$http.submit(null,api,{ param, loadingText:`${label}中`, onError:()=>setVisible(false) }).then(async data=>{
						setVisible(false)
						message.then(f=>f.success(`${label}成功`))
						onOk?.()
						if(refresh){
							$fn.delay(()=>{
								this?.fetch?.()
								if(this?.state && this.state.selectedKeys){
									$fn.clearKeys.call(this)
								}
							})
						}
					})
				}else{
					onOk?.(close)
				}
			} }
			onCancel	= { () => setVisible(false) }
			okText 		= '确认'
			cancelText 	= '取消'
		>
			<Button size={size} label={ label } onClick={()=>setVisible(true)} />
		</Popconfirm>
	)
}
export default Index